<template>
	<view>
		<view class="top">
			<image class="avatar" :src="pathway"></image>
			<view class="userName">请登录</view>
			<navigator class="install" url="../../packageB/merchant/merchant">
				<image src="../../static/person/功能.png"></image>
			</navigator>
			
		</view>
		<!-- 用户授权登录 -->
		<button class="change" open-type="getUserInfo" @tap="getUserProfile">登录</button>
		<!-- <button open-type="getUserInfo" @tap="signOut">退出登录</button> -->
		<view class="middle">
			<van-row>
				<navigator url="../../packageB/receipt/receipt">
					<van-col span="5">
						<image src="../../static/person/待收货.png"></image>
						<p>待收货</p>
					</van-col>
				</navigator>
				<navigator url="../../packageB/collect/collect">
					<van-col span="5">
						<image src="../../static/person/收藏.png"></image>
						<p id="sc">收藏</p>
					</van-col>
				</navigator>
				<navigator url="">
					<van-col span="5">
						<image src="../../static/person/客服.png"></image>
						<p>联系客服</p>
					</van-col>
				</navigator>
				<navigator url="../../packageB/apply/apply">
					<van-col span="5">
						<image src="../../static/person/卖家店铺.png"></image>
						<p>成为商家</p>
					</van-col>
				</navigator>
				<navigator url="../../packageB/all/all">
					<van-col span="4">
						<image src="../../static/person/订单.png"></image>
						<p>全部订单</p>
					</van-col>
				</navigator>
			</van-row>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return{
				pathway:'../../static/person/农业.png'
			};
		},
		methods:{
			// 获取用户信息
			getUserProfile(e){
				uni.getUserProfile({
					desc: '用于完善个人信息', // 声明获取用户个人信息后的用途，后续会展示在弹窗中，请谨慎填写
					success: (res)=>{
						console.log(res);
						if(res.errMsg==='getUserProfile:ok'){
							uni.showToast({
								title: '登录成功',
								duration: 2000
							});
							this.pathway = res.userInfo.avatarUrl;//获取用户微信头像
							// this.username = res.userInfo.nickName;//获取用户微信名
						}else{
							console.log('no')
						}
					}
				})
			}
		}
	}
</script>

<style lang="less">
.top{
	height: 15vh;
	background-color: rgb(233,237,246);
	display: flex;
	.avatar{
		width: 80px;
		height: 80px;
		border-radius: 50%;
		margin:auto 10vw;
	}
	.userName{
		margin: auto 0;
		color: rgb(104, 104, 104);
	}
	.install{
		width: 40px;
		height: 40px;
		margin: auto 0;
		margin-left:35vw;
		image{
			width: 100%;
			height: 100%;
		}
	}
}
.change{
	color: aliceblue;
	background-color: rgb(153, 210, 141);
}
.middle{
	color: rgb(108, 108, 108);
	display: block;
	margin-top: 20px;
	image{
		width: 30px;
		height: 30px;
		margin-left: 5.5vw;
		margin-top: 10px;
	}
	p{
		text-align: center;
	}
	#sc{
		width: 40px;
		margin-left: 3.5vw;
	}
}
button{
	width: 90vw;
	
}
</style>
